<template>
	<view class="inputs">
		<view @tap="change" class="input">
			<text v-if="flag">{{text}}</text>
			<input type="text" v-if="!flag"  focus="focus" @blur="b" v-model="value" class="vinput"/>
		</view>
		
	</view>
</template>

<script>
	export default {
		name:"Tinput",
		data() {
			return {
				flag:true,
				focus:true,
				value:'',
				old:''
			};
		},
		props:['text','url'],
		methods:{
			//点击，文本框变为input
			change(){
				this.value =this.text
				this.old = this.text
				this.flag = false
			},
			//input事件
			// a(e){
			// 	this.$emit('update:text',e.detail.value)
			// },
			//失去焦点事件
			b(){
				var flag
				this.flag = true
				if(this.old===this.value){
						return 
				}
				if(this.value!==''){					
					this.old = this.value	
				}else{
					this.value = this.old
					return uni.showToast({
						title: '修改失败',
						duration: 2000,
						icon:'error'
					});
				}
				this.$emit('update:text',this.value)
				this.$emit('change')
			},
		},
	}
</script>

<style lang="scss">
	.input,.inputs{
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
	}
</style>